<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript">
			function move_button(){
				var btn = document.getElementsByClassName('click-me');
				console.info(btn[0]);
				console.info(btn[0].style);
				var bg = getComputedStyle(btn[0],false).background;
				console.info('bg = '+ bg);
				console.info(rgbToHex(bg));
			}
			function rgbToHex(bg){
				var rgb = bg;
				console.info('rgb1 = '+rgb);
				var tmp  = bg.match(/^rgb\(*$\)/);
//				var tmp = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
				console.info('tmp = '+tmp);
//				rgb = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
				console.info('rgb2 = '+rgb);
				return rgb= "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
			}
			//rgb转换hex的函数
			function hex(x) {
				return ("0" + parseInt(x).toString(16)).slice(-2);
			}
		</script>
		<style type="text/css">
			.button-area{
				position: relative;
				width: 50px;
				float: left;
				height: 50px;
				background: red;
				padding: 100px;
			}
			.click-me{
				position: relative;
				background: wheat;
			}
		</style>
	</head>
	<body>
		<div class="button-area" onclick="move_button()">
			<button class="click-me">点我</button>
		</div>
	</body>
</html>
